//引入路由组件
import Home from '@/pages/Home'
import Search from '@/pages/Search' 
import Login from '@/pages/Login'
import Register from '@/pages/Register'
import Detail from '@/pages/Detail'
import AddCartSuccess from '@/pages/AddCartSuccess'
import ShopCart from '@/pages/ShopCart'
import Trade from '@/pages/Trade'
import Pay from '@/pages/Pay'
import PaySuccess from '@/pages/PaySuccess'
import Center from '@/pages/Center'
// 引入二级路由组件
import MyOrder from '@/pages/Center/myOrder'
import GroupOrder from '@/pages/Center/groupOrder'

/*
当打包构建应用时，JavaScript 包会变得非常大，影响页面加载
如果我们能把不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件，这样就更加高效了
*/
//路由配置的信息
export default [
    {
        path: "/center",
        component: Center,
        meta: {show: true},
        // 子路由（二级路由）
        children: [
            {
                path: 'myorder',
                component: MyOrder,
            },
            {
                path: 'grouporder',
                component: GroupOrder,
            },
            {
                path: '/center',
                redirect: '/center/myorder'
            }
        ]
    },
    {
        path: "/paysuccess",
        component: PaySuccess,
        meta: {show: true},

    },
    {
        path: "/pay",
        component: Pay,
        meta: {show: true},
        beforeEnter: (to, from, next) => {
            if(from.path == '/trade'){
                next()
            }else{
                next(false)
            }
        }
    },
    {
        path: "/trade",
        component: Trade,
        meta: {show: true},
        // 路由独享守卫
        beforeEnter: (to, from, next) => {
            // 去交易页面，必须是从购物车而来
            if(from.path == '/shopcart'){
                next()
            }else{
                // 其他的路由组件而来，则停留在当前页面
                // 从哪来回哪去
                next(false)
            }
        }
    },
    {
        path: "/shopcart",
        component: ()=>import("@/pages/ShopCart"),
        meta: {show: true}
    },
    {
        path: "/detail/:skuid",
        component: ()=>import("@/pages/Detail"),
        meta: {show: true}
    },
    {
        path: "/addcartsuccess",
        name: 'addcartsuccess',
        component: ()=>import("@/pages/AddCartSuccess"),
        meta: {show: true}
    },
    {
        path: "/home",
        component: ()=>import("@/pages/Home"),
        meta: {show: true}
    },
    {
        path: "/search/:keyword?",
        component: ()=>import("@/pages/Search"),
        meta: {show: true},
        name: "search",
        // 路由组件能不能传递props数据？
        //布尔值的写法: params
        // props: true,
        // 对象写法：额外的给路由组件传递一些props
        // props: {a: 1, b: 2}
        // 函数写法：可以把params参数、query参数，通过props传递给路由组件
        // props: ($route) => ({keyWord: $route.params.keyWord, k:$route.query.k})
        

    },
    {
        path: "/login",
        component: ()=>import("@/pages/Login"),
        meta: {show: false}
    },
    {
        path: "/register",
        component: ()=>import("@/pages/Register"),
        meta: {show: false}
    },
    //重定向，在项目跑起来的时候，访问/，立马让他定向到首页
    {
        path: '*',
        redirect: "/home"
    }
]